{% block css %}
    <link rel="stylesheet" href="/static/css/OwO.min.css">
{% endblock %}

<h3 class="form-btn blue-text"><a href="javascript:;"><i class="el-edit"></i>我要留言 / 展开表单</a></h3>
<div id="Coon" class="form-zd form-in">
    <form action="{% url 'blog:get_comment' blog.id %}" method="post" class="comment-form">
        {% if messages %}
            <script>
                {% for msg in messages %}
                    alert('{{ msg.message }}');
                {% endfor %}
            </script>
        {% endif %}
        {% csrf_token %}
        <div class="vwrap">
            <div class="vheader item3">
                <input class="vlink vinput" name="url_input" placeholder="链接" maxlength="100" required=""
                       id="id_url_input"
                       type="text">
                {{ form.url.errors }}
            </div>
            <div class="vedit">
                <textarea type="text" class="vediter vinput OwO-textarea" name="comment" placeholder="在这里输入吧..."
                          maxlength="500" required="" id="id_comment" cols="40" rows="10"></textarea>
                {{ form.comment.errors }}
                <div class="OwO" style="width: 50%;">
                    <div class="OwO-logo">
                        <span>OωO表情</span>
                    </div>
                </div>
                {% if request.user.username %}
                    <button class="vsubmit vbtn" type="submit">发表</button>
                {% else %}
                    <span class="li" style="display: none">{% url 'blog:login' %}</span>
                    <span class="lk" style="display: none">{{ request.path }}</span>
                    <button class="vsubmit vbtn" type="submit">
                        <a class="lc" href="javascript:;" style="color: #0181da">登陆后发表</a>
                    </button>
                    <input type="hidden" name="next" value="{{ request.GET.next }}"/>
                {% endif %}
            </div>
        </div>
    </form>
</div>
{% block js %}
    <script>
        var login = $('.li').text()
        var link = $('.lk').text()
        var rehref = login + '?next=' + link
        $('.lc').attr('href', rehref)
        {#console.log(login, link, rehref)#}
    </script>
    <script src="/static/js/OwO.min.js"></script>
    <script>
        var OwO_demo = new OwO({
            logo: 'OωO表情',
            container: document.getElementsByClassName('OwO')[0],
            target: document.getElementsByClassName('OwO-textarea')[0],
            api: '/static/OwO.json',
            position: 'down',
            width: '100%',
            maxHeight: '250px'
        });
    </script>
{% endblock %}

